
<style>
    .tableContentAdjust{
        text-align: center;
        vertical-align: middle;
    }
    @media print {
        .noprint {
            display: none
        }
        table, th, td {
            height: 40px;
            border: 1px solid #C7C7C7;
        }
        .border1{
            border:1px solid #C7C7C7;
        }
        input,select{
            border:none;
        }
    }
</style>

<div class="ribbon ">
    <a href=""><span class="home fa fa-home"></span></a>
    <ol class="breadcrumb">
        <li>坐席-电话统计报表</li>
    </ol>
</div>

<div class="table-wrapper">
    <div class="toolbar">
        <form role="form">
            <div class="row">
                <div class="col-md-3">
                    <label class="text">坐席工号：</label><span style="color:red">*</span>
                    <label class="input"><input type="text" class="form-control input-md" ng-model="q.userId"> </label>
                </div>
                <div class="col-md-4">
                    <label class="text">时间范围：</label><span style="color:red">*</span>
                    <label class="input"><input type="text"  id="datetimepickerStart"  class="form-control" ng-model="q.startTime"></label>
                    <label class="text">至</label>
                    <label class="input"><input type="text"  id="datetimepickerEnd"  class="form-control" ng-model="q.endTime"></label>
                </div>
                <div class="col-md-3">
                    <label class="text">日期类型：</label><span style="color:red">*</span>
                    <label class="input"><select  ng-model="q.type" ng-options="type for type in vm.types" class="form-control" ng-selected=""></select></label>
                    <label class="text">间隔数：</label><span style="color:red">*</span>
                    <label class="input"><select  ng-model="q.interval" ng-options="interval for interval in vm.intervals" class="form-control" ng-selected=""></select></label>
                </div>
                <div class="col-md-1">
                    <button ng-click="search()" class="btn btn-sm btn-primary noprint"><i class="fa fa-search"></i> 搜索 </button>
                </div>
                <div class="col-md-1">
                    <button ng-click="printPage()" class="btn btn-sm btn-primary noprint pull-right"><i class="fa fa-print"></i>打印</button>
                </div>

            </div>
            <div class="row">
                <div class="col-md-2">
                    <label style="color:red">带*是必填项</label>
                </div>
            </div>
        </form>
    </div>

    <table class="table table-striped table-hover props table-sm table-bordered table-condensed">
        <thead>
        <tr>
            <td width="12.5%" rowspan="2" class="message tableContentAdjust" >日期</td>
            <td width="12.5%" rowspan="2" class="message tableContentAdjust">坐席</td>
            <td width="25%" colspan="4" class="message tableContentAdjust">所有电话</td>
            <td width="25%" colspan="4" class="message tableContentAdjust">拨入电话</td>
            <td width="25%" colspan="4" class="message tableContentAdjust">拨出电话</td>
        </tr>

        <tr >
            <td width="6.25%" class="message tableContentAdjust">呼叫总计</td>
            <td width="6.25%" class="message tableContentAdjust">接通率</td>
            <td width="6.25%" class="message tableContentAdjust">通话总计</td>
            <td width="6.25%"  class="message tableContentAdjust">平均通话</td>

            <td width="6.25%"  class="message tableContentAdjust">电话</td>
            <td width="6.25%"  class="message tableContentAdjust">%</td>
            <td width="6.25%"  class="message tableContentAdjust">通话总计</td>
            <td width="6.25%"  class="message tableContentAdjust">平均通话</td>

            <td width="6.25%"  class="message tableContentAdjust">电话</td>
            <td width="6.25%"  class="message tableContentAdjust">%</td>
            <td width="6.25%"  class="message tableContentAdjust">通话总计</td>
            <td width="6.25%" class="message tableContentAdjust">平均通话</td>
        </tr>
        </thead>
        <tbody>
        <tr  ng-repeat="item in vm.dataList">
            <td class="message tableContentAdjust">{{item.date}}</td>
            <td class="message tableContentAdjust">{{item.agentUserName}}</td>
            <td class="message tableContentAdjust">{{item.totalCallData.count}}</td>
            <td class="message tableContentAdjust">{{item.totalCallData.hitRate}}</td>
            <td class="message tableContentAdjust">{{item.totalCallData.totalOperationInSec}}</td>
            <td class="message tableContentAdjust">{{item.totalCallData.avgOperationInSec}}</td>
            <td class="message tableContentAdjust">{{item.inBoundData.count}}</td>
            <td class="message tableContentAdjust">{{item.inBoundData.hitRate}}</td>
            <td class="message tableContentAdjust">{{item.inBoundData.totalOperationInSec}}</td>
            <td class="message tableContentAdjust">{{item.inBoundData.avgOperationInSec}}</td>
            <td class="message tableContentAdjust">{{item.outBoundData.count}}</td>
            <td class="message tableContentAdjust">{{item.outBoundData.hitRate}}</td>
            <td class="message tableContentAdjust">{{item.outBoundData.totalOperationInSec}}</td>
            <td class="message tableContentAdjust">{{item.outBoundData.avgOperationInSec}}</td>
        </tr>

        <tr>
            <td width="25%" colspan="2" class="message tableContentAdjust">小计</td>

            <td width="6.25%" class="message tableContentAdjust">{{vm.lastDataList.totalCallData.count}}</td>
            <td width="6.25%" class="message tableContentAdjust">{{vm.lastDataList.totalCallData.hitRate}}</td>
            <td width="6.25%" class="message tableContentAdjust">{{vm.lastDataList.totalCallData.totalOperationInSec}}</td>
            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.totalCallData.avgOperationInSec}}</td>

            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.inBoundData.count}}</td>
            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.inBoundData.hitRate}}</td>
            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.inBoundData.totalOperationInSec}}</td>
            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.inBoundData.avgOperationInSec}}</td>

            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.outBoundData.count}}</td>
            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.outBoundData.hitRate}}</td>
            <td width="6.25%"  class="message tableContentAdjust">{{vm.lastDataList.outBoundData.totalOperationInSec}}</td>
            <td width="6.25%" class="message tableContentAdjust">{{vm.lastDataList.outBoundData.avgOperationInSec}}</td>
        </tr>

        </tbody>
    </table>

</div>

